<template>
	<view class="">

		<u-toast ref="uToast" />

		<u-popup mode="bottom" v-model="show" border-radius="14" @close="close">

			<view class="u-padding-20">
				<view class="u-flex">
					<view>
						<u-image :src="info.cover" width="158" height="158"></u-image>
					</view>
					<view class="u-margin-left-20" style="width: 520rpx;">
						<view class="u-font-lg u-line-2">
							{{info.goodsName}}
						</view>
						<view class="u-flex u-row-between" style="align-items: center;">
							<view>
								
								<text
									style="color:#999999;font-size: 24rpx;margin-left: 10rpx;text-decoration: line-through;">原件：￥{{info.linePrice}}</text>
							</view>
							<view class="" style="color:#999999;font-size: 24rpx;" v-if="statusing!==4">
								库存：{{info.sku}}件
							</view>
						</view>
					</view>
				</view>

		

				<view class="u-flex u-row-between u-padding-20" style="margin: 20rpx 0;" >
					<view style="color: #333;font-size: 32rpx;font-weight: bold;">商品数量</view>
					<view>
						<u-number-box v-model="value" @change="valChange" bg-color="#007502" color="#fff" min="1">
						</u-number-box>
					</view>
				</view>
				
				<view class="u-flex u-row-between u-padding-20" style="margin: 20rpx 0;" >
					<view style="color: #333;font-size: 32rpx;font-weight: bold;">商品价格</view>
					<view style="color: #999;">
						￥{{info.price}}
					</view>
				</view>
				
				<view class="u-flex u-row-between u-padding-20" style="margin: 20rpx 0;" >
					<view style="color: #333;font-size: 32rpx;font-weight: bold;">商品总价</view>
					<view style="color: #FF7E01;font-size: 46rpx;">
						￥{{allprice}}
					</view>
				</view>

				<view >
					<u-button shape="circle" :custom-style="{background:'#FF6450',color:'#fff',marginTop:'40rpx'}"
						@click="submit" :disabled="info.sku?false:true" :ripple="true">{{info.sku?"确认":'库存不足'}}</u-button>
				</view>
				
								


			</view>

		</u-popup>
	</view>
</template>

<script>
	
	export default {
		watch:{
			show:{
				immediate: true, 
				handler(v){
					if(v){
						
						setTimeout(()=>{
							console.log(this.info.price)
							this.allprice=(Number(this.info.price)*this.value).toFixed(2)
						},100)
						
					}
				
				}
			}
		},
		data() {
			return {
				info: {},
				show: false,
				value: 1,
				statusing: "",
				allprice:""
			}
		},
		methods: {
			close(){
				this.show=false
			},
			
			valChange(e){
			
			if(this.info.priceTable.length){
				var datas=this.info.priceTable.filter(item=>item.num<=e.value)
				if(datas.length){
					this.allprice=(Number(datas[datas.length-1].price)*e.value).toFixed(2)
				}else{
					this.allprice=(Number(this.info.price)*e.value).toFixed(2)
				}
				
			}else{
				this.allprice=(Number(this.info.price)*e.value).toFixed(2)
			}
			
			
			
				
				
			},
			
			submit() {
				console.log(this.statusing)
				// 立即购买
				if(this.statusing==1){
					this.$u.post('/api/indent/cartAdd', {
						goods_id: this.info.id,
					
						num: this.value,
					}, {}).then(res => {
						this.$refs.uToast.show({
								title: '加入购物车成功',
								type: 'success',
						})
						this.$emit("carnum")
						this.show=false
					}).catch(err => {})
									
				}else{
					this.$u.post('/api/indent/affirm', {
						goods_id: this.info.id,
					
						num: this.value,
					}, {}).then(res => {
						uni.navigateTo({
							url: "../../pages/sure_book/index?num="+this.value+ '&id='+this.info.id 
						})
					}).catch(err => {})
					
				}
			
			   
			 
				
			},
		
			// 立即购买
			buy() {
				this.$u.post('/api/indent/affirm', {
					goods_id: this.info.id,
					goods_spec_id: this.$parent.Sid,
					num: this.value,
				}, {}).then(res => {
					uni.navigateTo({
						url: "../../pages/sure_book/index?num="+this.value+ '&Sid='+ this.$parent.Sid + '&id='+this.info.id +'&ptt='+1
					})
				}).catch(err => {})

			},
			//加入购物车
			addcar(){
				this.$u.post('/api/indent/cartAdd', {
					goods_id: this.info.id,
					goods_spec_id: this.$parent.Sid,
					num: this.value,
				}, {}).then(res => {
					this.$refs.uToast.show({
							title: '加入购物车成功',
							type: 'success',
					})
					this.show=false
				}).catch(err => {})
			
			}
			
			
		}
	}


</script>

<style lang="scss">
	.opti{
		opacity: 0.6;
	}
	.row {
		display: flex;
		flex-wrap: wrap;
	}

	.btn {
		width: 160rpx;
		height: 66rpx;
		line-height: 66rpx;
		background: #F7F7F7;
		border-radius: 60rpx;
		text-align: center;
		color: #999999;
		margin-right: 20rpx;
		margin-bottom: 20rpx;
	}

	.change {
		background: #628DFF;
		color: #FFFFFF;
		opacity: 1;
		transition: all 0.3s
	}
</style>
